<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学校签名</title>
    <link rel="stylesheet" href="../css/sign.css">
    <script src="../js/vue.js"></script>
    <script src="../js/axios.js"></script>
</head>

<body>
    <div class="header">
        <span>学校签名</span>
    </div>
    <div id="root">
        <div class="content">
            <form action="">
                <table class="con-table">
                    <thead class="con-th">
                        <tr>
                            <th>证书编号</th>
                            <th>学校地址</th>
                            <th>学生地址</th>
                            <th>签名学生</th>
                            <th>签名状态</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody class="con-tb">
                        <tr v-for="(p, index) in evidences" :key="index" @mouseEnter="showIndex(index)">
                            <td>{{p.evidencecode.substr(0,18)}}</td>
                            <td>{{p.schoolaccount.substr(0,18)}}</td>
                            <td>{{p.studentaccount}}</td>
                            <td>{{p.studentname}}</td>
                        
                            <td v-text="p.status == '1'?'已签':'未签'" :style="{color:(p.status == 1?'green':'red')}"></td>
                            <td><button @click.once="submit(evidenceIndex)" type="button">签名</button></td>
                        </tr>
                    </tbody>
                </table>
            </form>
        </div>
    </div>

    <script>
        const vm = new Vue({
            el: '#root',
            data: {
                evidences: [
                    // {
                    //     evidence_code:'',
                    //     schoolaccount: '',
                    //     headmastername: '',
                    //     schoolid: '',
                    //     status: 0,
                    // },
                    // {
                    //     evidence_code:'',
                    //     schoolaccount: '',
                    //     headmastername: '',
                    //     schoolid: '',
                    //     status: 0,
                    // },
                ],
                sign:{
                    address:'',
                    evidenceCode: '',
                },
                evidenceIndex:undefined

            },
            methods: {
                showIndex(index) {
                    this.evidenceIndex = index;  
                },
                getSignData() {
                    axios.get("http://localhost/getSignInfo").then(response => {
                        this.evidences = response.data.data;
                    })
                },
                submit(evidenceIndex){
                    this.sign.schoolaccount = this.evidences[evidenceIndex].schoolaccount;
                    this.sign.evidencecode = this.evidences[evidenceIndex].evidencecode;
                    axios.post("http://localhost/schoolsign",this.sign).then(response=>{
                        if (response.data.code == 200) {
                            alert("证书签名成功")
                            this.evidences[evidenceIndex].status = 1;
                            //跳转页面
                            // window.location.href="index.html";
                        } else {
                            alert("证书签名失败")
                        }
                    })
                    // this.evidences[evidenceIndex].status = 1;
                }
            },

            mounted() {
                this.getSignData()
            }
        
        })
    </script>
</body>

</html>